@header-height: 55px;

// 定义滚动条变量
@scrollbar-size: 8px;
@scrollbar-thumb-color: #bfbfbf;
@scrollbar-thumb-hover-color: #8c8c8c;
@scrollbar-track-color: transparent;

:root {
  --header-height: @header-height;
  --transition-duration: 0.3s;
}

body {
  background: var(--color-bg-elevated) !important;
}

.ant-layout .ant-layout-header {
  height: @header-height;
  padding: 0;
  line-height: @header-height;
  background: var(--color-bg-container) !important;
  border-bottom: 1px solid var(--color-border-secondary);
}

.ant-layout .ant-layout-sider {
  background: var(--color-bg-container) !important;
}

.ant-layout {
  background: var(--color-bg-elevated) !important;
}

.title-label {
  position: relative;
  padding-left: 16px;

  &::before {
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 4px;
    height: 1em;
    content: '';
    background-color: var(--color-primary);
    border-radius: 2px;
    transform: translateY(-50%);
  }
}

.split-line {
  position: relative;

  &::before {
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 2px;
    height: 1em;
    content: '';
    background-color: var(--color-text);
    border-radius: 1px;
    transform: translateY(-50%);
  }
}

// 全局滚动条样式（应用于整个页面）
html {
  scrollbar-color: @scrollbar-thumb-color @scrollbar-track-color;
  // Firefox 支持
  scrollbar-width: thin;

  // Webkit 内核浏览器
  &::-webkit-scrollbar {
    width: @scrollbar-size;
    height: @scrollbar-size;
  }

  &::-webkit-scrollbar-thumb {
    background-color: @scrollbar-thumb-color;
    border-radius: @scrollbar-size / 2;
    transition: background-color 0.3s;

    &:hover {
      background-color: @scrollbar-thumb-hover-color;
    }
  }

  &::-webkit-scrollbar-track {
    background-color: @scrollbar-track-color;
  }
}

// 局部容器样式（添加 .antd-scrollbar 类到需要样式的容器）
.antd-scrollbar {
  scrollbar-color: @scrollbar-thumb-color @scrollbar-track-color;
  // Firefox 支持
  scrollbar-width: thin;

  // Webkit 内核浏览器
  &::-webkit-scrollbar {
    width: @scrollbar-size;
    height: @scrollbar-size;
  }

  &::-webkit-scrollbar-thumb {
    background-color: @scrollbar-thumb-color;
    border-radius: @scrollbar-size / 2;
    transition: background-color 0.3s;

    &:hover {
      background-color: @scrollbar-thumb-hover-color;
    }
  }

  &::-webkit-scrollbar-track {
    background-color: @scrollbar-track-color;
  }
}
